{extend name="AdminEx/index" /}

{block name="main"}
        <!-- page heading start-->
        <div class="page-heading">
            <h3>
                 {$title}
            </h3>
            <ul class="breadcrumb">
                <li>
                    <a href="#">Dashboard</a>
                </li>
                <li>
                    <a href="#">Data Table</a>
                </li>
                <li class="active"> Editable Table </li>
            </ul>
        </div>
        <!-- page heading end-->

        <!--body wrapper start-->
        <div class="wrapper">
             <div class="row">
                <div class="col-sm-12">
                <section class="panel">
                <header class="panel-heading">
                    查看用户
                    <span class="tools pull-right">
                        <a href="javascript:;" class="fa fa-chevron-down"></a>
                        <a href="javascript:;" class="fa fa-times"></a>
                     </span>
                </header>
                <div class="panel-body">
                <div class="adv-table editable-table ">
                <div class="clearfix">
                    <div class="btn-group">
                        <button id="editable-sample_new" class="btn btn-primary">
                            Add New <i class="fa fa-plus"></i>
                        </button>
                    </div>
                    <div class="btn-group pull-right">
                        <button class="btn btn-default dropdown-toggle" data-toggle="dropdown">Tools <i class="fa fa-angle-down"></i>
                        </button>
                        <ul class="dropdown-menu pull-right">
                            <li><a href="#">Print</a></li>
                            <li><a href="#">Save as PDF</a></li>
                            <li><a href="#">Export to Excel</a></li>
                        </ul>
                    </div>
                </div>
                <div class="space15"></div>
                <table class="table table-striped table-hover table-bordered" id="editable-sample">
                <thead>
                <tr>
                    <th>ID</th>
                    <th>用户名</th>
                    <th>真实姓名</th>
                    <th>角色(/密码)</th>
                    <th>分配角色</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>

                {volist name="list" id="v"}
                <tr class="">
                    <td>{$v['id']}</td>
                    <td>{$v['username']}</td>
                    <td>{$v['name']}</td>
                    <td class="center">{$v['rname']}
                    </td>
                    <td><a data-id="{$v['id']}" href="{:url('admin/user/read',['id'=>$v['id']])}"><button class="btn btn-success btn-sm" type="button">assign</button></a></td>
                    <td><a class="edit" data-id="{$v['id']}" href="javascript:;"><button class="btn btn-info btn-sm" type="
                        button">edit</button></a>
                        <a class="delete" data-id="{$v['id']}" href="javascript:;"><button class="btn btn-danger btn-sm" type="button">Delete</button></a>
                    </td>
                </tr>
                {/volist}

                </tbody>
                </table>
                </div>
                </div>
                </section>
                </div>
                </div>
        </div>
        <!--body wrapper end-->

        <!--footer section start-->
        <footer>
            2014 &copy; AdminEx by <a href="http://www.tcode.me/" target="_blank">淘代码</a>
        </footer>
        <!--footer section end-->


    </div>
    <!-- main content end-->
</section>
{/block}



{block name="myjs"}
<!--data table-->
{js href="/static/layout/js/data-tables/jquery.dataTables.js"}
{js href="/static/layout/js/data-tables/DT_bootstrap.js"}

<!--script for editable table-->
{js href="/static/layout/js/editable-table.js"}

<!-- END JAVASCRIPTS -->
{js href="/static/admin/js/toastr.min.js"}
<script>
    jQuery(document).ready(function() {
        EditableTable.init();
    });

    // 执行ajax删除
    function delAjax(id,row) {
        $.ajax({
                dataType:'json',
                type: 'delete',
                url: '/user/'+id+'.html',
                success: function (data) {
                    console.log(data);
                    if (data.status) {
                        row.remove();
                        toastr.success(data.info);
                    }else{
                        toastr.error(data.info,'WARING');
                    }
                },
                error: function (){
                    alert('AJAX 请求出现错误!');
                }
            });
    }

    // 执行ajax编辑
    function editAjax(obj) {
        $.ajax({
                data:obj,
                dataType:'json',
                type: 'put',
                url: '/user/'+obj['id'],
                success: function (data) {
                    console.log(data);
                    if (data.status) {
                        toastr.success(data.info);
                    }else{
                        toastr.error(data.info,'WARING');
                    }
                },
                error: function (){
                    alert('AJAX 请求出现错误!');
                }
            });
    }

    // 执行ajax编辑
    function addAjax(obj) {
        $.ajax({
                data:obj,
                dataType:'json',
                type: 'post',
                url: '/user',
                success: function (data) {
                    console.log(data);
                    if (data.status) {
                        toastr.success(data.info);
                        window.location.reload();
                    }else{
                        toastr.error(data.info,'WARING');
                    }
                },
                error: function (){
                    alert('AJAX 请求出现错误!');
                }
            });
    }
</script>
{/block}


